import { Link } from "react-router-dom"
import { gql, useQuery } from "@apollo/client"
import { useEffect, useMemo } from "react"


const GetSelfSideQuery = gql`
    query GetSelfSide{
        getRouter
    }
`
const routerMap = {
    "个人中心": "/",
    "商家管理": "/shop",
    "商品管理": "/goods",
    "订单中心": "/order",
    "评论管理": "/comment",
    "订单列表": "/user",
    "我的订单": "/user/mine",

    "我的商品": "/goods/mine",
    "商品订单": "/order/goods",
    "商品评论": "/comment/goods"
} as {
        [k in string]: string
    }
const Side = () => {
    const { data } = useQuery(GetSelfSideQuery)
    const routers = useMemo(() => ["个人中心", ...(data?.getRouter || [])], [data]);
    return (
        <div className="h-full bg-base-100 menu min-w-56 rounded-box">
            {routers.map((name: string) => (
                <li key={name}>
                    <Link to={routerMap[name]}>{name}</Link>
                </li>
            ))}
        </div>
    )
}
export default Side